<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Site</title>
</head>
<body>
    <style>
        .header {
            border-bottom: 2px solid gray;
        }
        .card {
            background-color: #eee;
            padding: 10px;
            margin-bottom: 10px;
        }
        .color {
            color: red;
        }
    </style>
    <header id="header" class="header">
        <h2>Site</h2>
    </header>


    <nav id="navigation">
        <ul>
            <li><a href="#">Item 1</a></li>
            <li><a href="#">Item 2</a></li>
            <li><a href="#">Item 3</a></li>
        </ul>
    </nav>

    <hr>

    <aside></aside>

    <section>
        <article id="block1" class="card header">
            <h3>Block 1</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. <span class="color">Accusantium alias, cumque delectus eius, </span>error eveniet excepturi expedita, explicabo libero maiores necessitatibus nemo nostrum omnis perferendis quasi quibusdam reiciendis vel! Animi aperiam consequatur dolorem doloribus eius enim et, fugit id inventore, laboriosam maxime odit officia quas qui suscipit ut veniam voluptatibus?</p>
        </article>
        <article id="block2" class="card">
            <h3>Block 2</h3>
            <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusantium commodi corporis ipsam laudantium odio quas, qui quibusdam repellat sapiente voluptas?</p>
        </article>
    </section>

    <footer id="footer">
        <h4>Contact me</h4>
        <ul>
            <li>Insta</li>
            <li>Telega</li>
            <li>YoTb</li>
        </ul>
    </footer>

</body>
</html>